<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="../../layui/css/layui.css" media="all">
    <script src="../../layui/layui.js" charset="utf-8"></script>
    <script src="../../js/jquery-3.4.1.min.js" charset="utf-8"></script>
    <link rel="stylesheet" href="../../layui/formSelects-v4.css"/>
    <script src="add.js"></script>
</head>
<body>
<form class="layui-form">
    <br>
    <div class="layui-form-item">
        <label class="layui-form-label" style="width: 100px">nacos名称<span style="color: red">*</span></label>
        <div class="layui-input-inline">
            <input type="text" style="width: 200px" name="nacosName" id="nacosName" lay-verify="required" autocomplete="on"
                   class="layui-input">
        </div>
        <label class="layui-form-label" style="width: 100px">nacos端口<span style="color: red">*</span></label>
        <div class="layui-input-inline">
            <input type="text" style="width: 200px" name="nacosPort" id="nacosPort" lay-verify="required" autocomplete="on" value="8848" placeholder="8848"
                   class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label" style="width: 100px">nacos用户名<span style="color: red">*</span></label>
        <div class="layui-input-inline">
            <input type="text" style="width: 200px" name="nacosUsername" id="nacosUsername" lay-verify="required" autocomplete="on" value="nacos" placeholder="nacos"
                   class="layui-input">
        </div>
        <label class="layui-form-label" style="width: 100px">nacos密码<span style="color: red">*</span></label>
        <div class="layui-input-inline">
            <input type="text" style="width: 200px" name="nacosPassword" id="nacosPassword" lay-verify="required" autocomplete="on" value="nacos" placeholder="nacos"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item layui-form">
        <label class="layui-form-label" style="width: 100px">docker宿主机<span style="color: red">*</span></label>
        <div class="layui-input-inline dockerId" style="width: 530px">
            <input type="text" name="dockerName" id="dockerName" oninput="dockerNameInput()" class="layui-input"
                   placeholder="请输入docker服务器名称搜索" style="position:absolute;z-index:2;width:88%;" value="" autocomplete="off">
            <select name="dockerId" placeholder="请输入docker服务器名称搜索" id="dockerId" lay-filter="dockerId" >
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label" style="width: 100px">nacos地址<span style="color: red">*</span></label>
        <div class="layui-input-inline">
            <input type="text" style="width: 530px" name="nacosUrl" id="nacosUrl" lay-verify="required" autocomplete="on"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label" style="width: 100px">挂载目录<span style="color: red">*</span></label>
        <div class="layui-input-inline">
            <input type="text" style="width: 530px" name="mountPath" id="mountPath" lay-verify="required" autocomplete="on"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label" style="width: 100px">数据库类型<span style="color: red">*</span></label>
        <div class="layui-input-inline" style="width: 530px">
            <select name="dbType" placeholder="" id="dbType" lay-filter="dbTypeChange">
                <option id="mysql">mysql</option>
                <option id="postgres">postgres</option>
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label" style="width: 100px">数据库IP<span style="color: red">*</span></label>
        <div class="layui-input-inline dbId" style="width: 530px">
            <input type="text" name="dbName" id="dbName" oninput="dbNameInput()" class="layui-input"
                   placeholder="输入数据库IP" style="position:absolute;z-index:2;width:88%;" value="" autocomplete="off">
            <select name="dbId" placeholder="输入数据库IP" id="dbId" lay-filter="dbId" >
            </select>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label" style="width: 100px">数据库名称<span style="color: red">*</span></label>
        <div class="layui-input-inline">
            <input type="text" style="width: 530px" name="databaseName" id="databaseName" lay-verify="required" autocomplete="on"
                   class="layui-input">
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-input-inline" style="position: absolute;left: 300px">
            <button class="layui-btn" lay-submit="" lay-filter="save">提交</button>
            <button class="layui-btn"  id="close">关闭</button>
        </div>
    </div>
</form>
</body>
</html>